<!doctype html>
 
<html lang="en">
<head>
	<meta charset="utf-8" />
	<title>jQuery UI Progressbar - Default functionality</title>
	<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
	<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
	<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
	
	<script type="text/javascript" src="js/index.coffee">  </script>

	<style type="text/css">
	.ui-progressbar {
		position: relative;
	}
	.progress_label {
		position: absolute;
		left: 50%;
		top: 8px;
		font-weight: bold;
		text-shadow: 1px 1px 0 #fff;
		font-family: monospace;
	}
	
	#pomodoro_timer{
		font-family: monospace;
	}
	</style>

</head>
<body>
 
<div id="pomodoro_timer">
 
	<div class="progressbar">
		<div class="progress_label">00:00</div>
	</div>
	<div class="ui-widget-header ui-corner-all">
		  <button class="begin">Back</button>
		  <button class="play">Start a pomodoro</button>
	 	  <button class="stop">Long break</button>
	 	  Tâche en cours : <input type="text" class="task" name="task" value=""/>
  		  <button class="clear">Clear</button>
	</div>
</div>
 
<div id="log_container"></div>
 
<audio src="sound/pomo_begin.wav" type="audio/wav" id="pomo_begin"></audio>
<audio src="sound/aborted.wav" type="audio/wav" id="aborted"></audio>
<audio src="sound/break.wav" type="audio/wav" id="break"></audio>
<audio src="sound/long_break.wav" type="audio/wav" id="long_break"></audio>
 
</body>
</html>
